<div class="layout hasFixedFooter">
    <header class="search">
        <a href="javascript:history.back()" class="back"><img src="images/back.png" alt=""></a>
        <div id="searchBar">
            <form action="" method="get">
                <i></i>
                <input type="text" name="keyword" ng-model="keyword" ng-change="search()">
            </form>
        </div>
    </header>
    <div class="filter">
        <ul>
            <li ng-class="{selected: filterIndex==1 && IsShowFilter}"><span ng-click="showFilter(1)">全部医院<i></i></span></li>
            <li ng-class="{selected: filterIndex==2 && IsShowFilter}"><span ng-click="showFilter(2)">全部科室<i></i></span></li>
            <li ng-class="{selected: filterIndex==3 && IsShowFilter}"><span ng-click="showFilter(3)">智能排序<i></i></span></li>
        </ul>
    </div>
    <div class="filterSelector" ng-show="IsShowFilter && filterIndex==3">
        <ul>
            <li ng-click="filterClick('',filterIndex)">全部</li>
            <li ng-repeat="item in filters" ng-click="filterClick(item.hospital_code||item.department_code, filterIndex)">{{item.hospital_name||item.department_name}}</li>
        </ul>
    </div>
    <div class="filterSelector" ng-show="IsShowFilter && filterIndex!=3">
        <ul class="level1">
            <li ng-click="filterClick('',filterIndex)" ng-class="{selectedLevel1: !selectedItem}">全部</li>
            <li ng-repeat="item in filters" ng-class="{selectedLevel1: selectedItem && selectedItem == item}" ng-click="selectLevel1(item)">{{item.area_name||item.department_name}}</li>
        </ul>
        <ul class="level2">
            <li ng-repeat="item in selectedItem.subnode" ng-click="filterClick(item.hospital_code||item.department_code, filterIndex)">{{item.hospital_name||item.department_name}}</li>
        </ul>
        <div class="clear"></div>
    </div>
    <div class="mask" ng-show="IsShowFilter"></div>

    <div class="hr"></div>
    <div class="doctorList" infinite-scroll='expert.nextPage()' infinite-scroll-disabled='expert.busy' infinite-scroll-distance='1'>
        <section class="item" ng-repeat="item in expert.items">
            <section class="avatar">
                <img src="{{item.doctor_headphoto}}">
            </section>
            <section class="desc">
                <p class="line1"><span class="name">{{item.doctor_name}}</span><span class="level">{{item.doctor_qualifications}}</span><span class="department">{{item.doctor_department_sub}}</span></p>
                <p class="line2">{{item.doctor_hospital}}</p>
                <p class="line3">{{item.doctor_goodat}}</p>
                <div>
                    <a href="#/ExpertHome?mobile={{item.doctor_mobile}}"><img src="images/icon-single-person.png"></a>
                    <a href="#/ExpertHome?mobile={{item.doctor_mobile}}"><img src="images/icon-double-person.png"></a>

                    <span ng-if="item.distance=='340282350000000000000000000000000000000'"><img src="images/distance.png"> 未知 </span>
                    <span ng-if="item.distance!='340282350000000000000000000000000000000'"><img src="images/distance.png"> {{item.distance}}km </span>
                </div>
            </section>
        </section>
        <div ng-show='expert.busy'>Loading...</div>
    </div>
    <footer class="nav">
        <ul>
            <li><a href="#/ExpertList"><img src="images/nav-1.png" alt=""><br>首页</a></li>
            <li><a href="#/OrderFromMe"><img src="images/nav-2.png" alt=""><br>咨询订单</a></li>
            <li><a href="#/YxjtList"><img src="images/nav-2.png" alt=""><br>医学讲堂</a></li>
            <li><a href="#/MemberCenter"><img src="images/nav-3.png" alt=""><br>个人主页</a></li>
        </ul>
    </footer>
</div>